<template>
  <div>
    <nav-bar title="历史记录"></nav-bar>
    <div class="maxinBox">
      <div class="backgroundfff">
        <van-cell required title="签到日期" @click="show = true" is-link :value="date" />
        <van-popup v-model="show" position="bottom" style="height: 40%">
          <van-datetime-picker
            type="date"
            v-model="currentDate"
            @confirm="onConfirm"
            @cancel="show = false"
            title="请选择签到日期"
            :min-date="minDate"
            :max-date="maxDate"
          />
        </van-popup>
        <van-row class="signManage" @click="getDetails(item)" v-for="(item,index) in dataList" :key="index">
          <van-col :span="22">
            <van-row>
              <van-col :span="12">
                <span v-if="item.checkType === 1">点位打卡</span>
                <span v-else-if="item.checkType === 2">加班开始签到</span>
                <span v-else>加班结束签到</span>
              </van-col>
              <van-col :span="12">{{item.checkTime}}</van-col>
            </van-row>
            <van-row>
              <van-col :span="24">{{item.checkPointName}}</van-col>
            </van-row>
          </van-col>
          <van-col :span="2" v-if="item.checkType !== 1">
            <van-icon style="line-height: 2.5rem;" name="arrow" />
          </van-col>
        </van-row>
      </div>
    </div>

  </div>
</template>

<script>
  import moment from 'moment'
  import signManage from '../../../../api/workAPI/signManage.js'
  export default {
    data() {
      return {
        show: false,
        date: moment(new Date()).format('YYYY-MM-DD'),
        minDate: new Date(2015, 0, 1),
        maxDate: new Date(),
        currentDate: new Date(),
        dataList: []
      }
    },
    methods: {
      getDetails(data) {
        if (data.checkType !== 1) {
          localStorage.setItem('historyData', JSON.stringify(data))
          this.$router.push({
            name: 'HistoryDetails'
          })
        }
      },
      onConfirm(date) {
        this.show = false;
        this.date = moment(date).format('YYYY-MM-DD')
        this.getHistoryList()
      },
      getHistoryList() {
        let projectId = localStorage.getItem('projectId')
        signManage.getHistoryList(projectId, this.date).then(res => {
          this.dataList = res
        })
      },
    },
    mounted() {
      this.getHistoryList()
    }
  }
</script>
<style scoped lang="scss">
  .signManage{
    padding: 0.9375rem;
    font-size: 0.875rem;
    border-bottom: 0.0625rem solid #E5E5E5;
  }
</style>
